<template>
	<view class="column-div" :style="{width: type ? '316rpx' : '423rpx',position: 'relative','z-index': 2}">
		<view class="column-div item-view" :style="{height: type ? '86rpx': '88rpx'}">
			<image :src="type ? '/static/assets/cube2.png':'/static/assets/cube1.png'"></image>
			<view class="text-view">{{title}}</view>
		</view>
		<view class="text-number">{{text}}</view>
	</view>
</template>

<script>
	export default {
		props: {
			type: {
				type: Boolean,
				default: () => false
			},
			title: {
				type: String,
				default: ''
			},
			text: {
				type: String,
				default: ''
			}
		},
		data() {
			return {

			};
		}
	}
</script>

<style scoped lang="scss">
	.item-view {
		width: 100%;
		position: relative;
		margin-bottom: 25upx;
		z-index: 2;

		image {
			width: 100%;
			height: 100%;
			position: absolute;
			top: 0;
			left: 0;
		}
	}

	.text-view {
		font-size: 30upx;
		font-family: PingFang SC;
		font-weight: 500;
		color: #FFFFFF;
	}

	.text-number {
		font-size: 40upx;
		font-family: PingFang SC;
		font-weight: bold;
		color: #FFFFFF;
	}
</style>
